<template>
  <div class="page">
    <div class="layui-fluid">
      <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
          <div class="layui-card">
            <div class="layui-card-body" style="font-size:15px;">
              <div class="layui-form" lay-filter="">
                <div class="layui-form-item">
                  <div class="layui-inline">
                    <label class="layui-form-label">充值用户</label>
                    <div class="layui-input-inline" style="width: 190px;">
                      <input
                        type="text"
                        name='accountName'
                        v-model="itemData.accountName"
                        placeholder="请输入用户名"
                        autocomplete="off"
                        disabled='disabled'
                        class="layui-input"
                      />
                    </div>
                  </div>
                </div>

                <div class="layui-form-item">
                  <div class="layui-inline">
                    <label class="layui-form-label">充值金额</label>
                    <div class="layui-input-inline" style="width: 190px;">
                      <input
                        type="number"
                        name='amount'
                        v-model="itemData.amount"
                        placeholder="请输入充值金额"
                        autocomplete="off"
                        class="layui-input"
                      />
                    </div>
                  </div>
                </div>

                 <div class="layui-form-item">
                  <label class="layui-form-label">交易类型</label>
                  <div class="layui-input-inline" style="width: 190px;">
                    <select name='cashType' lay-filter="cashType" v-model="itemData.cashType" >
                      <option value="0">请选择</option>
                      <option value="1">现金支付</option>
                      <option value="2">银行支付</option>
                      <option value="3">支付宝支付</option>
                      <option value="4">微信支付</option>
                      <option value="5">其他</option>
                    </select>
                  </div>
                </div>

                <div class="layui-form-item" id="test1">
                    <label class="layui-form-label">交易流水号</label>
                    <div class="layui-input-inline" style="width: 190px;">
                      <input
                        type="text"
                        v-model="itemData.orderSerialno"
                        placeholder="请输入交易流水号"
                        autocomplete="off"
                        class="layui-input"
                      />
                    </div>
                </div>

                <div class="layui-form-item">
                  <label class="layui-form-label">备注</label>
                  <div class="layui-input-inline" style="width: 190px;">
                    <input
                      type="text"
                      name='note'
                      v-model="itemData.note"
                      placeholder="请输入备注"
                      autocomplete="off"
                      class="layui-input"
                    />
                  </div>
                </div>

                <div class="layui-form-item">
                  <label class="layui-form-label">充值类型</label>
                  <div class="layui-input-inline" style="width: 190px;">
                    <select name='assetTypeId' lay-filter="assetTypeId" v-model="itemData.assetTypeId" >
                      <option value="0">请选择</option>
                      <option value="3001">现金充值</option>
                      <option value="3002">UC充值</option>
                    </select>
                  </div>
                </div>

                <div class="layui-form-item">
                  <div class="layui-inline">
                    <label class="layui-form-label">充值凭证</label>
                    <div class="layui-input-inline" style="width: 190px;">
                      <div class="layui-upload">
                        <button
                          type="button"
                          class="layui-btn"
                          id="layuiadmin-upload-useradmin"
                        >
                          选择文件
                        </button>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="layui-form-item">
                  <div class="layui-inline">
                    <label class="layui-form-label">图片预览</label>
                    <div class="layui-input-inline" style="width: 190px;">
                      <img
                        id="img"
                        :src="
                          itemData.voucherPicture
                            ? itemData.voucherPicture
                            : require('@/assets/zwyl.jpg')
                        "
                        style="width:100px;height:100px;"
                      />
                    </div>
                  </div>
                </div>


                <div class="layui-form-item">
                  <div class="layui-input-block">
                    <button
                      class="layui-btn layui-btn-normal"
                      lay-submit
                      @click="sure"
                    >
                      确认
                    </button>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "userpay",
  data() {
    return {
      id: "",
      itemData: {
        accountName:'',//用户名
        amount:'',
        cashType:'',
        note:'',
        voucherPicture:'',
        assetTypeId:''
      },
    };
  },
  mounted() {
    var _this = this;
     layui.use("upload", function() {
      var upload = layui.upload;
      var uploadInst = upload.render({
        elem: "#layuiadmin-upload-useradmin", //绑定元素
        data: {
          type: 2
        },
        url:imguploadurl, //上传接口
        done: function(res) {
          layer.msg("上传成功");
          _this.itemData.voucherPicture = res.msg;
        },
        error: function() {
          layer.msg("上传失败");
        }
      });
    });
    window.getdates = this.getdates;
 },
  methods: {
      getdates: function (data) {
      //回选详情
      var _this = this;
        _this.id = data.id;
        _this.itemData.accountName = data.name;
    },
      sure: function () {
      var _this = this;
      var url = "/crm/aapi/v1.9/auditor-recharge";
      var dates = _this.itemData
      dates.amount = _this.itemData.amount*100
      dates.accountId = _this.id
    // alert(JSON.stringify(_this.id))
      ajaxRequest(url, "POST", "json", dates, function (ret, err) {
        layer.msg("设置成功");
        setTimeout(function () {
          var index = parent.layer.getFrameIndex(window.name);
          parent.layer.close(index);
        //   parent.location.reload();
        }, 1000);
      });
    },
  },
  updated: function () {
    var _this = this;
    layui.use("form", function () {
      var form = layui.form;
      form.render();
      form.on("select(cashType)", function (data) {
         _this.itemData.cashType  = data.value;
        //  alert(JSON.stringify(data.value))
        if(data.value=='0' ){
            document.getElementById("test1").style.display="none";
        }else if(data.value=='1'){
            document.getElementById("test1").style.display="none";
        }else {
            document.getElementById("test1").style.display="";
        }
      });
      form.on("select(assetTypeId)", function (data) {
         _this.itemData.assetTypeId  = data.value;
      });

    });
  },
};
</script>
<style scoped></style>